<div>
  <h2 class="mat-dialog-title">新建文档</h2>
  <mat-dialog-content>
    <form>
      <mat-form-field>
        <input matInput placeholder="文件夹" aria-label="Dir" [matAutocomplete]="auto" [formControl]="dirCtrl" [(ngModel)]="data.dir" name="dirName">
        <mat-error *ngIf="dirCtrl.hasError('required')">
          文件夹 <strong>必填</strong>
        </mat-error>
        <mat-autocomplete #auto="matAutocomplete">
          <mat-option *ngFor="let dir of filteredDirs | async" [value]="dir.name">
            <span>{{ dir.name }}</span>
          </mat-option>
        </mat-autocomplete>
      </mat-form-field>
      <br />
      <mat-form-field class="example-full-width">
        <input matInput [(ngModel)]="data.file" placeholder="文件名" name="fileName" [formControl]="fileCtrl">
        <mat-error *ngIf="fileCtrl.hasError('required')">
          文件名 <strong>必填</strong>
        </mat-error>
      </mat-form-field>
    </form>
  </mat-dialog-content>
  <mat-dialog-actions>
    <button id="doalog-btn" mat-raised-button [mat-dialog-close]="data" color="primary" [disabled]="hasError()">确定</button>
  </mat-dialog-actions>
</div>
